 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core">

<ui:composition template="/template.xhtml">

	<ui:define name="title">
	ShopX | Order Page
	</ui:define>

	<ui:define name="body">
	
	<h:panelGroup id="deliveryAddress" layout="block" rendered="#{!orderBacking.formCorrect}">  		
  		
  		<h:form id="addressForm">
  		
  			<h:outputText value = "#{msgs.deliveryAddress}" styleClass="title" />
  			<br/> <br/>
  			
  			<h:outputLabel for="name" value="#{msgs.name}" style="font-weight:bold;"/>
  			<h:inputText id="name" value="#{orderBean.addressBean.customerName}" 
  			size="12"  styleClass="input" validator="#{formValidator.validateName}" >
  				<f:ajax render="en" />
  			</h:inputText>
  			<h:outputText id="en" value="#{formValidator.nameError}" styleClass="error" />
  			<br/> <br/>
  			
  			<h:outputLabel for="otherCountry" value="#{msgs.country}" style="font-weight:bold;"/>
  			<h:inputText id="otherCountry" value="#{orderBacking.otherCountry}"  size="15" 
  			validator="#{formValidator.validateCountry}" styleClass="input" disabled="#{!orderBacking.countryLogic}">
  				<f:ajax render="ec" listener="#{orderBacking.chooseOtherCountry}"/>
  			</h:inputText>
  			<h:selectOneMenu id="country" value="#{orderBacking.country}" 
  			styleClass="menuInput">
  				<f:ajax event="valueChange" render="otherCountry" listener="#{orderBacking.chooseCountry}"/>
  				<f:selectItems value="#{orderBacking.defaultCountries}" />
  			</h:selectOneMenu>
  			<h:outputText id="ec" value="#{formValidator.countryError}" styleClass="error" />
  			<br/> <br/>
  				
  			<h:outputLabel for="city" value="#{msgs.city}" style="font-weight:bold;"/>
  			<h:inputText id="city" value="#{orderBean.addressBean.city}" size="15" 
  			validator="#{formValidator.validateCity}" styleClass="input" >
  				<f:ajax render="eci" />
			</h:inputText>
			<h:outputText id="eci" value="#{formValidator.cityError}" styleClass="error" />	 
  			<br/> <br/>
  			
  			<h:outputLabel for="street" value="#{msgs.street}" style="font-weight:bold;"/>
  			<h:inputText id="street" value="#{orderBean.addressBean.streetName}"  size="15" 
  			validator="#{formValidator.validateStreet}" styleClass="input" >
  				<f:ajax render="es" />
  			</h:inputText>
  			 
  			<h:selectOneMenu id="streetKind" value="#{orderBean.addressBean.streetKind}" 
  			styleClass="menuInput">
  				<f:selectItems value="#{orderBacking.defaultStreetKinds}" />
  				<f:ajax />
  			</h:selectOneMenu>
  			<h:outputText id="es" value="#{formValidator.streetError}" styleClass="error" />
  			<br/> <br/>
  			
  			<h:outputLabel for="house" value="#{msgs.house}" style="font-weight:bold;"/>
  			<h:inputText id="house" value="#{orderBean.addressBean.house}"  size="5" 
  			validator="#{formValidator.validateHouseNumber}" styleClass="input" >
  				<f:ajax render="ehouse" />
  			</h:inputText>
  			<br/>
  			<h:outputText id="ehouse" value="#{formValidator.houseError}" styleClass="errorHouse" />
  			<br/>
  			
  			<h:outputLabel for="building" value="#{msgs.building}" />
  			<h:inputText id="building" value="#{orderBean.addressBean.building}"  size="5" 
  			validator="#{formValidator.validateBuildingNumber}" styleClass="input" style="font-weight:normal;">
  				<f:ajax render="eb" />
  			</h:inputText>  			
  			<h:outputText id="eb" value="#{formValidator.buildingError}" styleClass="error" />
  			<br/> <br/>
  				
  			<h:outputLabel for="flat" value="#{msgs.flat}" style="font-weight:bold;"/>
  			<h:inputText id="flat" value="#{orderBean.addressBean.flat}"  size="5" 
  			validator="#{formValidator.validateFlatNumber}" styleClass="input">
  				<f:ajax render="ef" />
  			</h:inputText>
  			<h:outputText id="ef" value="#{formValidator.flatError}" styleClass="error" />
  			<br/> <br/>
  			
  			<h:outputLabel for="phone" value="#{msgs.phone}" style="font-weight:bold;"/>
  			<h:inputText id="phone" value="#{orderBean.addressBean.contactPhone}"  size="15" 
  			validator="#{formValidator.validatePhone}" styleClass="input">
  				<f:ajax render="ep" />
  			</h:inputText>
  			<h:outputText id="ep" value="#{formValidator.phoneError}" styleClass="error" />
  			<br/> <br/>
  			
  			<h:outputLabel for="zipCode" value="#{msgs.zipCode}" />
  			<h:inputText id="zipCode" value="#{orderBean.addressBean.zipCode}"  size="8" 
  			validator="#{formValidator.validateZip}" styleClass="input" render="zm" style="font-weight:normal;">
  				<f:ajax render="ez" />
  			</h:inputText>
  			<h:outputText id="ez" value="#{formValidator.zipError}" styleClass="error" />
  			<br/> <br/>
  			
  			<h:commandButton id="confirmAddress" value="Confirm info" >
  				<f:ajax render="@all" listener="#{orderBacking.confirmAddress}" />
  			</h:commandButton>
  			<br/>
  			<h:outputText id="cer" value="#{formValidator.addressError}" styleClass="error" 
  			style="left:40px;" />
  			<br/>
  		
  		</h:form>
  		
  	</h:panelGroup>
  	
  	<h:panelGroup id="parchmentTop" layout="block" rendered="#{orderBacking.formCorrect}"/>
  	
  	<h:panelGroup id="confirmOrder" layout="block" rendered="#{orderBacking.formCorrect}">
  		<h:outputText styleClass="orderText" style="font-weight:bold;" value="#{msgs.goodsToBuy}" /> <br/>
  	<ui:repeat value="#{basketBacking.goodsBeans}" var="goods">
  		<h:outputText styleClass="orderText" value="#{goods.producerValue} #{goods.modelValue} - " />
  		<h:outputText styleClass="orderText" value="#{goods.priceBYRValue}" >
  			<f:converter binding="#{priceConverter.instance}" />
  		</h:outputText>
  		<h:outputText styleClass="orderText" value="  - #{orderBean.basket[goods]} piece(s)" />
  		<br/>
  	</ui:repeat> <br/>
  	  <h:outputText styleClass="orderText" style="font-weight:bold;" value="#{msgs.totalCost}" /> <br/>
  	  <h:outputText styleClass="orderText" value="#{orderBean.totalPrice}">
  	  	<f:converter binding="#{priceConverter.instance}" />
  	  </h:outputText> <br/> <br/>
  	  <h:outputText styleClass="orderText" style="font-weight:bold;" value="#{msgs.deliveryAddress1}" /> <br/>
  	  <h:outputText styleClass="orderText" value="#{msgs.name}  #{orderBean.addressBean.customerName}" /> <br/>
  	  <h:outputText styleClass="orderText" value="#{msgs.country}  #{orderBean.addressBean.country}" /> <br/>
  	  <h:outputText styleClass="orderText" value="#{msgs.city}  #{orderBean.addressBean.city}" /> <br/>
  	  <h:outputText styleClass="orderText" value="#{msgs.street}  #{orderBean.addressBean.streetName} #{orderBean.addressBean.streetKind}" /> <br/>
  	  <h:outputText styleClass="orderText" value="#{msgs.house}  #{orderBean.addressBean.house}" /> <br/>
  	  <h:outputText styleClass="orderText" value="#{msgs.building}  #{orderBean.addressBean.building}" /> <br/>
  	  <h:outputText styleClass="orderText" value="#{msgs.flat}  #{orderBean.addressBean.flat}" /> <br/>
  	  <h:outputText styleClass="orderText" value="#{msgs.phone}  #{orderBean.addressBean.contactPhone}" /> <br/>
  	  <h:outputText id="zip" styleClass="orderText" value="#{msgs.zipCode}  #{orderBean.addressBean.zipCode}" rendered="#{!empty orderBean.addressBean.zipCode}"/> <br/> <br/>
  	</h:panelGroup>
   
   <h:panelGroup id="parchmentBottom" layout="block" rendered="#{orderBacking.formCorrect}">
   
   <h:commandButton id="makeOrder" value="Make order" styleClass="orderButtons" 
   action="#{redirectNavigator.getIndexOutcome}">
   		<f:ajax listener="#{orderBacking.makeOrder}"/>
   </h:commandButton>
   
   <h:commandButton id="clearOrder" value="Clear order" styleClass="orderButtons" 
    action="#{redirectNavigator.getBasketOutcome}">
    	<f:ajax listener="#{orderBacking.clearOrder}"/>
    </h:commandButton>
    
   <h:commandButton id="editGoods" value="Edit goods " styleClass="orderButtons" 
    action="#{redirectNavigator.getBasketOutcome}" >
    	<f:ajax/>
    </h:commandButton>
    
   	<h:commandButton id="editAddress" value="Edit address info" styleClass="orderButtons" >
		<f:ajax listener="#{orderBacking.editAddress}" render="@all"/>
	</h:commandButton>
   
   </h:panelGroup>
   
    </ui:define>    
 </ui:composition>

</html>